// 列表组件
import React, { Component } from 'react';
import { SoundOutlined } from '@ant-design/icons';
import "../css/entry.scss"
import {One} from '../apis/link'

class MyEntry extends Component {

    constructor(props){
        super(props);
        this.state = {
            data:[]
        }
        // console.log(this.state.data)
    }
    componentDidMount = () => { 
        One().then((data) => {
            this.setState({
                data:data.data
            })           
        })    
    }
   
    render() {
        return (
            <div>
                <SoundOutlined style={{ color:"red" }} />
                <span className="wz">1分抵1元。请您点击此处查看《购物须知》</span>
                <div className="list">
                    {
                        // 列表渲染, 使用js中的map函数
                        // console.log(this.state.data)
                        this.state.data && this.state.data.map((item)=>{               
                            return (
                                <div className="cate">
                                    <img src={item.pic} alt="" />
                                    <div className="name"> {item.title} </div>
                                </div>
                            )
                        })
                    }
                </div>
            </div>
        );
    }
}

export default MyEntry;
